import React, { useContext, useState } from 'react';
import {Alert, View, ImageBackground, TouchableOpacity, Dimensions} from 'react-native';
import { Button, Image, Text } from 'react-native-elements';

import LocaleContext from '../libs/locale';
import logo from '../assets/aboutlogo.png';
const pkg = require('../package.json');

import UpdateDialog from '../components/UpdateView';
const {width,height,scale} = Dimensions.get("window");

const About = ({ navigation }: any) => {
  const locale = useContext(LocaleContext);
  const [isUpdateAlert, setIsUpdateAlert] = useState(0);

  return (
    // <View >
      // <UpdateDialog />
    <View style={{ marginTop: 40, alignItems: 'center', flex: 1 }}>

      <UpdateDialog startDownload = {isUpdateAlert + ''} />

      <View style={{ alignItems: 'center', flex: 1 }}>
        <ImageBackground source={logo} style={{
          width: 60,
          height: 60,
          // borderWidth: 1,
          borderColor: '#787878FF',
          // borderRadius: 8
        }} />
        <Text style={{
          marginTop: 20,
          fontWeight: 'bold',
          fontSize: 18
        }}>{locale?._('Guest.slogan')}</Text>
        <Text style={{
          marginTop: 30
        }}>{locale?._('My.about.version')} {pkg.version}</Text>
          <TouchableOpacity onPress={()=>{ navigation.navigate('WebBrowserInfo',{showExplore:true,url:"https://smartx.one",title:locale?._("Assets.tx.Blockbrowser")})}}>
            <Text style={{marginTop: 20,fontWeight: 'bold',fontSize: 18,textDecorationLine:"underline"}}>{locale?._('officialWebsite')}</Text>
          </TouchableOpacity>
          <TouchableOpacity onPress={()=>{ navigation.navigate('WebBrowserInfo',{showExplore:true,url:locale?._("updateUrl"),title:locale?._("Assets.tx.Blockbrowser")})}}>
              <Text style={{marginTop: 20,fontWeight: 'bold',fontSize: 18,textDecorationLine:"underline"}}>{locale?._('updateWebsite')}</Text>
          </TouchableOpacity>
      </View>
      <View style={{ marginBottom: 40 }}>
        <Button
          type='outline'
          title={locale?._('My.about.checkNewVersion')}
          onPress={() =>
            {
              setIsUpdateAlert(isUpdateAlert+1);
              // downloadAPKForInstall()
              // Alert.alert('', '敬请期待')
            }}
          buttonStyle={{borderColor:'#7460E3FF'}}
          titleStyle={{color:'#7460E3FF'}}
      />
      </View>
    </View>
    // </View>
  );
};

export default About;
